var box = document.getElementById("img_4");          // 获取轮播图元素
var imgyuan = document.getElementsByClassName('li1');       // 获取4原点元素
var time = 1;

setInterval('right()',4000);        // 设置图片自动切换

function right() {                 // 设置图片右移函数
    time++;
    if (time>4){
        time = 1;
    }
    add(time);
}
function left() {                  // 设置图片左移函数
    time--;
    if (time<1){
        time = 4;
    }
    add(time);
}

function add(sum) {    // 设置数字图片切换函数

    switch (sum){
        case 1:
            box.style.backgroundImage = "url('https://res.shiguangkey.com//file/201806/19/20180619142252602590185.jpg')";
            break;
        case 2:
            box.style.backgroundImage = "url('https://res.shiguangkey.com//file/201806/19/20180619141337485823895.jpg')";
            break;
        case 3:
            box.style.backgroundImage = "url('https://res.shiguangkey.com//file/201806/21/20180621150342030454625.jpg')";
            break;
        case 4:
            box.style.backgroundImage = "url('https://res.shiguangkey.com//file/201805/17/20180517113424433990524.jpg')";
            break;
    }
}

// 设置点击原点切换图片
imgyuan[0].onclick = function () {
    add(1);
};
imgyuan[1].onclick = function () {
    add(2);
};
imgyuan[2].onclick = function () {
    add(3);
};
imgyuan[3].onclick = function () {
    add(4);
};


// 设置点击选项栏的那个，哪个的class名就改变

// $(()=>{
//     let $newsLi = $('#Column-4 ul li');//获取列表
//     $newsLi.click(function(event) {
//         $(this).addClass('active').siblings('li').removeClass('active');
//         //add 为增加被选择  siblings获取除被选中元素之外所有的同级元素节点；removeClass 为删除被选择
//         //判断设置栏目信息默认隐藏
//         if($(this).text()==='自然语言'){
//             let $news = $('#自然语言');
//             $news.removeClass('hide').siblings('li').addClass('hide');
//         }if($(this).text()==='java'){
//             let $news = $('#java');
//             $news.removeClass('hide').siblings('li').addClass('hide');
//         }if($(this).text()==='python'){
//             let $news = $('#python');
//             $news.removeClass('hide').siblings('li').addClass('hide');
//         }if($(this).text()==='c++'){
//             let $news = $("#c加加");
//             $news.removeClass('hide').siblings('li').addClass('hide');
//         }if($(this).text()==='最新资讯') {
//             let $news = $("#最新资讯");
//             $news.removeClass('hide').siblings('li').addClass('hide');
//         }
//     });
// });


$(()=>{});
//index

// $(function () {
//   // 新闻列表功能
//   let $newsLi = $("#Column-4 ul li");
//   let iPage = 1;  //默认第1页
//   let iTotalPage = 1; //默认总页数为1
//   let sCurrentTagId = 0; //默认分类标签为0
//   let bIsLoadData = true;   // 是否正在向后台加载数据
//
//
//   fn_load_content();
//
//   $newsLi.click(function () {
//     // 点击分类标签，则为点击的标签加上一个class属性为active
//     // 并移除其它兄弟元素的上的，值为active的class属性
//     $(this).addClass('active').siblings('li').removeClass('active');
//     // 获取绑定在当前选中分类上的data-id属性值
//     let sClickTagId = $(this).children('a').attr('data-id');
//     //判断设置栏目信息默认隐藏
//         if($(this).text()==='自然语言'){
//             let $news = $('#自然语言');
//             $news.removeClass('hide').siblings('li').addClass('hide');
//         }if($(this).text()==='java'){
//             let $news = $('#java');
//             $news.removeClass('hide').siblings('li').addClass('hide');
//         }if($(this).text()==='python'){
//             let $news = $('#python');
//             $news.removeClass('hide').siblings('li').addClass('hide');
//         }if($(this).text()==='c++'){
//             let $news = $("#c加加");
//             $news.removeClass('hide').siblings('li').addClass('hide');
//         }if($(this).text()==='最新资讯') {
//             let $news = $("#最新资讯");
//             $news.removeClass('hide').siblings('li').addClass('hide');
//         }
//
//     if (sClickTagId !== sCurrentTagId) {
//             sCurrentTagId = sClickTagId;  // 记录当前分类id
//             // 重置分页参数
//             iPage = 1;
//             iTotalPage = 1;
//             fn_load_content()
//         }
//   });
//
//   //页面滚动加载相关
//   $(window).scroll(function () {
//     // 浏览器窗口高度
//     let showHeight = $(window).height();
//
//     // 整个网页的高度
//     let pageHeight = $(document).height();
//
//     // 页面可以滚动的距离
//     let canScrollHeight = pageHeight - showHeight;
//
//     // 页面滚动了多少,这个是随着页面滚动实时变化的
//     let nowScroll = $(document).scrollTop();
//
//     if ((canScrollHeight - nowScroll) < 100) {
//       // 判断页数，去更新新闻数据
//       if (!bIsLoadData) {
//         bIsLoadData = true;
//         // 如果当前页数据如果小于总页数，那么才去加载数据
//         if (iPage < iTotalPage) {
//           iPage += 1;
//           $(".btn-more").remove();  // 删除标签
//           // 去加载数据
//           fn_load_content()
//         } else {
//           message.showInfo('已全部加载，没有更多内容！');
//           $(".btn-more").remove();  // 删除标签
//           $("#Column-list").append($('<a href="javascript:void(0);" class="btn-more">已全部加载，没有更多内容！</a>'))
//         }
//       }
//     }
//   });
//
//   // 定义向后端获取新闻列表数据的请求
//   function fn_load_content() {
//     // let sCurrentTagId = $('.active a').attr('data-id');
//
//     // 创建请求参数
//     let sDataParams = {
//       "tag_id": sCurrentTagId,
//       "page": iPage
//     };
//
//     // 创建ajax请求
//     $.ajax({
//       // 请求地址
//       url: "/news/",  // url尾部需要添加/
//       // 请求方式
//       type: "GET",
//       data: sDataParams,
//       // 响应数据的格式（后端返回给前端的格式）
//       dataType: "json",
//     })
//       .done(function (res) {
//         if (res.errno === "0") {
//           iTotalPage = res.data.total_pages;  // 后端传过来的总页数
//           if (iPage === 1) {
//             $("#Column-list").html("")
//           }
//
//           res.data.news.forEach(function (one_news) {
//             let content = `
//               <li class="news-item">
//                  <a href="#" class="news-thumbnail" target="_blank">
//                     <img src="${one_news.image_url}" alt="${one_news.title}" title="${one_news.title}">
//                  </a>
//                  <div class="news-content">
//                     <h4 class="news-title"><a href="#">${one_news.title}</a></h4>
//                     <p class="news-details">${one_news.digest}</p>
//                     <div class="news-other">
//                       <span class="news-type">${one_news.tag_name}</span>
//                       <span class="news-time">${one_news.update_time}</span>
//                       <span class="news-author">${one_news.author}</span>
//                     </div>
//                  </div>
//               </li>`;
//             $("#Column-list").append(content)
//           });
//
//           // $("#Column-list").append($('<a href="javascript:void(0);" class="btn-more">滚动加载更多</a>'));
//           // 数据加载完毕，设置正在加载数据的变量为false，表示当前没有在加载数据
//           bIsLoadData = false;
//
//         } else {
//           // 登录失败，打印错误信息
//           message.showError(res.errmsg);
//         }
//       })
//       .fail(function () {
//         message.showError('服务器超时，请重试！');
//       });
//   }
//
// });

//毕业

$(function () {
  // 新闻列表功能
  let $newsLi = $("#Column-4 ul li");
  let iPage = 1;  //默认第1页
  let iTotalPage = 1; //默认总页数为1
  let sCurrentTagId = 0; //默认分类标签为0
  let bIsLoadData = true;   // 是否正在向后台加载数据


  fn_load_content();

  $newsLi.click(function () {
    // 点击分类标签，则为点击的标签加上一个class属性为active
    // 并移除其它兄弟元素的上的，值为active的class属性
    $(this).addClass('active').siblings('li').removeClass('active');
    // 获取绑定在当前选中分类上的data-id属性值
    let sClickTagId = $(this).children('a').attr('data-id');

    if (sClickTagId !== sCurrentTagId) {
            sCurrentTagId = sClickTagId;  // 记录当前分类id
            // 重置分页参数
            iPage = 1;
            iTotalPage = 1;
            fn_load_content()
        }
  });

  //页面滚动加载相关
  $(window).scroll(function () {
    // 浏览器窗口高度
    let showHeight = $(window).height();

    // 整个网页的高度
    let pageHeight = $(document).height();

    // 页面可以滚动的距离
    let canScrollHeight = pageHeight - showHeight;

    // 页面滚动了多少,这个是随着页面滚动实时变化的
    let nowScroll = $(document).scrollTop();

    if ((canScrollHeight - nowScroll) < 100) {
      // 判断页数，去更新新闻数据
      if (!bIsLoadData) {
        bIsLoadData = true;
        // 如果当前页数据如果小于总页数，那么才去加载数据
        if (iPage < iTotalPage) {
          iPage += 1;
          $(".btn-more").remove();  // 删除标签
          // 去加载数据
          fn_load_content()
        } else {
          message.showInfo('已全部加载，没有更多内容！');
          $(".btn-more").remove();  // 删除标签
          $("#Column-list").append($('<a href="javascript:void(0);" class="btn-more">已全部加载，没有更多内容！</a>'))
        }
      }
    }
  });

  // 新闻轮播图功能
  fn_load_banner();
  /*=== bannerStart ===*/
  let $banner = $('#img_4');
  let $picLi = $("#img_4 .pic");
  let $prev = $('#left');
  let $next = $('#right');
  let $tabLi = $('#img_4 ul li');
  let index = 0;

  // 小原点
  $tabLi.click(function () {
    index = $(this).index();
    $(this).addClass('active').siblings('li').removeClass('active');
    $picLi.eq(index).fadeIn(1500).siblings('li').fadeOut(1500);
  });
  // 点击切换上一张
  $prev.click(function () {
    index--;
    if (index < 0) {
      index = $tabLi.length - 1
    }
    $tabLi.eq(index).addClass('active').siblings('li').removeClass('active');
    $picLi.eq(index).fadeIn(1500).siblings('li').fadeOut(1500);
  }).mousedown(function () {
    return false
  });

  $next.click(function () {
    auto();
  }).mousedown(function () {
    return false
  });
  //  图片向前滑动
  function auto() {
    index++;
    index %= $tabLi.length;
    $tabLi.eq(index).addClass('active').siblings('li').removeClass('active');
    $picLi.eq(index).fadeIn(3000).siblings('li').fadeOut(3000);
  }

  // 定时器
  let timer = setInterval(auto, 2000);
  $banner.hover(function () {
    clearInterval(timer)
  }, function () {
    auto();
  });

  /*=== bannerEnd ===*/



  // 定义向后端获取新闻列表数据的请求
  function fn_load_content() {
    // let sCurrentTagId = $('.active a').attr('data-id');

    // 创建请求参数
    let sDataParams = {
      "tag_id": sCurrentTagId,
      "page": iPage
    };

    // 创建ajax请求
    $.ajax({
      // 请求地址
      url: "/news/",  // url尾部需要添加/
      // 请求方式
      type: "GET",
      data: sDataParams,
      // 响应数据的格式（后端返回给前端的格式）
      dataType: "json",
    })
      .done(function (res) {
        if (res.errno === "0") {
          iTotalPage = res.data.total_pages;  // 后端传过来的总页数
          if (iPage === 1) {
            $("#Column-list").html("")
          }

          res.data.news.forEach(function (one_news) {
            let content = `
            <ul style="position: relative" >
                <li id="最新资讯" style="position: absolute" class="=c-list">
                        <!--第一条信息-->
                      <div class="list-1" style="position: relative">
                            <a href="/news_id/${one_news.id}/" class="news-thumbnail"
                         target="_blank">
                                <img src="${one_news.image_url}" alt="${one_news.title}"
                               title="${one_news.title}">
                            </a>
                            <span style="position: absolute">
                                 <ul>
                                    <li style="font-size: 25px;padding-bottom:40px"><a href="/news_id/${one_news.id}/">${one_news.title}</a></li>
                                    <li><a href="javascript:void(0)">${one_news.digest}</a></li>
                                 </ul>

                                <div class="news-other">
                                    <span class="news-type">${one_news.tag_name}</span>
                                    <span class="news-time">${one_news.update_time}</span>
                                    <span class="news-author">${one_news.author}</span>
                                </div>
                            </span>
                      </div>
                </li>
            </ul>`;
            $("#Column-list").append(content)
          });

          // $("#Column-list").append($('<a href="javascript:void(0);" class="btn-more">滚动加载更多</a>'));
          // 数据加载完毕，设置正在加载数据的变量为false，表示当前没有在加载数据
          bIsLoadData = false;

        } else {
          // 登录失败，打印错误信息
          message.showError(res.errmsg);
        }
      })
      .fail(function () {
        message.showError('服务器超时，请重试！');
      });
  }


  // function fn_load_banner() {
  //   $.ajax({
  //     // 请求地址
  //     url: "/news/banners/",  // url尾部需要添加/
  //     // 请求方式
  //     type: "GET",
  //     async: false
  //   })
  //     .done(function (res) {
  //       if (res.errno === "0") {
  //         let content = ``;
  //         let tab_content = ``;   //按钮
  //         res.data.banner.forEach(function (one_banner, index) {
  //           if (index === 0){
  //             // 需要修改 href  接收后台传来的id号 响应详情页  one_banner.news_id
  //             content = `
  //               <li style="display:block;"><a href="/news/${one_banner.news_id}/">
  //                <img src="${one_banner.image_url}" alt="${one_banner.news_title}"></a></li>
  //             `;
  //             tab_content = `<li class="active"></li>`;
  //           } else {
  //             content = `
  //             <li><a href="/news/${one_banner.news_id}/"><img src="${one_banner.image_url}" alt="${one_banner.news_title}"></a></li>
  //             `;
  //             tab_content = `<li></li>`;
  //           }
  //
  //           $(".pic").append(content);  // 内容
  //           $(".tab").append(tab_content); // 标签
  //         });
  //
  //       } else {
  //         // 登录失败，打印错误信息
  //         message.showError(res.errmsg);
  //       }
  //     })
  //     .fail(function () {
  //       message.showError('服务器超时，请重试！');
  //     });
  // }

});